<!DOCTYPE HTML>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>填写申述内容</title>
    <link rel="stylesheet" type="text/css" href="../css/aui.css" />

</head>

<body>
    <div class="aui-timeline" style="margin-top:0.8rem">
        <div class="aui-timeline-item">
            <div class="aui-timeline-item-label aui-bg-info text-light">Step.1</div>
            <div class="aui-timeline-item-inner">
                <div class="aui-card-list">
                    <div class="aui-card-list-header aui-border-b">
                        <div>申诉类型：</div>
                    </div>
                    <div class="aui-card-list-content-padded" >
                        <select name="" id="appeal_type" style="border:1px solid #ccc;">
                          <option value="" selected="selected" disabled="disabled">请选择申述类型</option>
                          <option value="1">审核订单号</option>
                          <option value="2">单号被审核有误</option>
                          <option value="3">取消使用资格</option>
                          <option value="4">其它</option>
                        </select>
                    </div>
                </div>
            </div>
        </div>
        <div class="aui-timeline-item">
            <div class="aui-timeline-item-label aui-bg-success text-light">Step.2</div>
            <div class="aui-timeline-item-inner">
                <div class="aui-card-list">
                    <div class="aui-card-list-header aui-border-b">申述理由:</div>
                    <div class="aui-card-list-content" style="padding:0.6rem;">
                        <textarea name="name" id="buyer_cause" style="border:1px solid #ccc;height:5rem;" placeholder="请输入试用过程和体验"></textarea>
                    </div>
                </div>
            </div>
        </div>
        <div class="aui-timeline-item">
            <div class="aui-timeline-item-label aui-bg-primary text-light">Step.3</div>
            <div class="aui-timeline-item-inner">
                <div class="aui-card-list">
                    <div class="aui-card-list-header aui-border-b">
                        <div>手机：</div>
                    </div>
                    <div class="aui-card-list-content-padded" >
                        <input type="text" id="buyer_phone" style="border:1px solid #ccc;">
                    </div>
                </div>
            </div>
        </div>
        <div class="aui-timeline-item">
            <div class="aui-timeline-item-label aui-bg-warning text-light">Step.4</div>
            <div class="aui-timeline-item-inner">
                <div class="aui-card-list">
                    <div class="aui-card-list-header aui-border-b">
                        <div>QQ：</div>

                    </div>
                    <div class="aui-card-list-content-padded" >
                        <input type="text" id="buyer_qq" style="border:1px solid #ccc;">
                    </div>
                </div>
            </div>
        </div>
        <div class="aui-timeline-item">
            <div class="aui-timeline-item-label aui-bg-danger text-light">Step.5</div>
            <div class="aui-timeline-item-inner">
                <div class="aui-card-list">
                    <div class="aui-card-list-header aui-border-b">
                        <div>旺旺：</div>
                    </div>
                    <div class="aui-card-list-content-padded" >
                        <input type="text" id="buyer_ww" style="border:1px solid #ccc;">
                    </div>
                </div>
            </div>
        </div>
        <div class="aui-timeline-item">
            <div class="aui-timeline-item-label aui-bg-success text-light">Step.6</div>
            <div class="aui-timeline-item-inner">
                <div class="aui-card-list">
                    <div class="aui-card-list-header aui-border-b">上传凭证文件：</div>
                    <div class="aui-card-list-content-padded">
                        <div class="aui-row aui-row-padded" id="img-id">
                            <div class="aui-col-xs-4 img-url-1" onclick="fnUploadPic(this);" data-class="img-url-1">
                                <img src="./img/add_pic.png" name="buyer_imgs_url[]"  style="width:100px" />
                            </div>
                            <div class="aui-col-xs-4 img-url-2" onclick="fnUploadPic(this);" data-class="img-url-2">
                                <img src="./img/add_pic.png" name="buyer_imgs_url[]"  style="width:100px" />
                            </div>
                            <div class="aui-col-xs-4 img-url-3" onclick="fnUploadPic(this);" data-class="img-url-3">
                                <img src="./img/add_pic.png" name="buyer_imgs_url[]"  style="width:100px" />
                            </div>
                            <div class="aui-col-xs-4 img-url-4" onclick="fnUploadPic(this);" data-class="img-url-4">
                                <img src="./img/add_pic.png" name="buyer_imgs_url[]"  style="width:100px" />
                            </div>
                            <div class="aui-col-xs-4 img-url-5" onclick="fnUploadPic(this);" data-class="img-url-5">
                                <img src="./img/add_pic.png" name="buyer_imgs_url[]"  style="width:100px" />
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</body>
<script type="text/javascript" src="../script/api.js"></script>
<script type="text/javascript" src="./conf/config.js"></script>
<script type="text/javascript" src="./js/common.js"></script>
<script type="text/javascript" src="../script/jquery-1.8.2.min.js"></script>
<script type="text/javascript">
    apiready = function() {
        var goodName = api.pageParam.goodName;

        $("#good-name").html(goodName);
    };

    function fnUploadPic(that){
    var data_class=$(that).attr("data-class");
        api.actionSheet({
            title: '上传照片',
            cancelTitle: '取消',
            buttons: ['拍照', '手机相册']
        }, function(ret, err) {
            if (ret) {
                getPicture(ret.buttonIndex,data_class);
            }
        });
    };

    function getPicture(sourceType,data_class) {
        switch (sourceType) {
            case 1:
                var operate_type = 'camera';
                break;
            case 2:
                var operate_type = 'album';
                break;

        }
        //获取一张图片
        api.getPicture({
            sourceType: operate_type, //
            encodingType: 'jpg',
            mediaValue: 'all',
            destinationType: 'base64',
            allowEdit: true,
            quality: 50,
            saveToPhotoAlbum: false
        }, function(ret, err) {
            if (ret.data) {
                //saveImg(ret.data,valueId,imgId);
                saveImg(ret.data,data_class);
                //$api.byId('avatar').src=ret.data;
            } else {
                api.toast({
                    msg: '图像获取失败',
                    duration: 3000,
                    location: 'bottom'
                })
            }
        });


    }
    //保存剪辑图像
    function saveImg(path,data_class) {
      //alert(path);
      //alert(data_class);

        api.showProgress({
            title: '上传中...',
            text: '先喝杯茶...',
        });
        //上传剪辑后的图像到服务器
        api.ajax({
            // report : false,
            url: SITE_URL + 'index.php?m=api&c=appnew&a=ajax_img_aliyun',
            //这里是我们约定好的后台上传图片的位置 ，你可以根据你的需求来改
            method: 'post',
            cache: 'false',
            timeout: 30,
            dataTpye: 'json',
            data: {
                files: {
                    file: path
                }
            }
        }, function(ret, err) {
          //alert(JSON.stringify(ret));
            if (ret.status == 1) {
                api.hideProgress();
                $("."+data_class).find("img").attr("src",ret.msg.src);
                //$api.byId('avatar').src = ret.msg.src;
            }

        });
    };

    function fnSubmit() {
      //alert(1);
        var userInfo = $api.getStorage('userInfo');
        //获取数据app中存入的数据然后分配到模板中；
        var random = userInfo.random;
        var userid = userInfo.userid;
        //获取需要的参数
        var orderId = api.pageParam.orderId;
            var appealType=$("#appeal_type").val();
            var buyeCause=$("#buyer_cause").val();
            var buyerPhone=$("#buyer_phone").val();
            var buyerQq=$("#buyer_qq").val();
            var buyerWw=$("#buyer_ww").val();

            var img1=$("#img-id").find(".img-url-1").find("img").attr("src");
            var img2=$("#img-id").find(".img-url-2").find("img").attr("src");
            var img3=$("#img-id").find(".img-url-3").find("img").attr("src");
            var img4=$("#img-id").find(".img-url-4").find("img").attr("src");
            var img5=$("#img-id").find(".img-url-5").find("img").attr("src");


            //var buyer_imgs_url={img1,img2,img3,img4,img5};
            //alert(buyer_imgs_url);
        api.ajax({
            url: SITE_URL + 'index.php?m=api&c=appnew&a=appeal_order',
            method: 'POST',
            data: {
                values: {
                    "userid": userid,
                    "random": random,
                    "order_id": orderId,
                    "appeal_type": appealType,
                    "buyer_cause": buyeCause,
                    "buyer_phone": buyerPhone,
                    "buyer_qq": buyerQq,
                    "buyer_ww": buyerWw,
                    "buyer_imgs_url_img1":img1,
                    "buyer_imgs_url_img2":img2,
                    "buyer_imgs_url_img3":img3,
                    "buyer_imgs_url_img4":img4,
                    "buyer_imgs_url_img5":img5,

                }
            }
        }, function(ret, err) {
          //alert(JSON.stringify(ret));
            if (ret.status == 1) {
                alert(ret.msg);
                api.closeWin();
                closeWin();
            } else {
                alert(ret.msg);
            }

        });

    }

    function closeWin() {
        GoToRefresh(); //关闭窗口时先刷新指定窗口页面,如需刷新主界面，name请填写root

    }


    function GoToRefresh() {
        api.execScript({
            name: 'task_ing',
            frameName: 'task_ing_frame_1',
            script: 'fnGetData(5);'
        });
    }
</script>

</html>
